<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>藏味优品</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="stylesheet" href="__CSS__/amazeui.min.css"/>
    <link rel="stylesheet" href="__CSS__/style.css"/>
    <link rel="stylesheet" href="__CSS__/dropload.css"/>
    <script src="__JS__/jquery.min.js"></script>
    <script src="__JS__/amazeui.min.js"></script>
    <script src="__JS__/dropload.min.js"></script>
</head>
<body>
<style type="text/css">
    .top-box {
        padding:10px;
        width:100%;
        background-color:#F8B600;
        position: relative;
        color: white;
    }

    .top-box a {
        color: white !important;
    }

    .top-title {
        margin-left:20px;
        font-size:16px;
    }
    .top-right {
        font-size:16px;
        position:absolute;
        top:50%;
        right:10px;
        margin-top:-12px;
    }
    .title-box {
        border-bottom: 1px solid #bcbcbc;
        height:40px;
    }

    .list-product-price-span2 {
        display:block;
        font-size:1.4rem !important;
        line-height:1.8rem;
        height: 3.6rem;
        overflow: hidden;
        width: 100%;
        word-wrap: break-word;
    }
    .product-list-share {
        color:#F2431F;
        font-weight:bold;
    }
    .product-detail-box {
        padding:2px;
    }
    .product-name-box {
        margin-bottom: 2px;
    }
    .detail-price {
        float:left;
    }
</style>
<div class="top-box am-vertical-align">
    <div class="top-title am-vertical-align-middle">
        <a href="{:U('Index/index')}"><span>藏味优品</span></a>
    </div>
    <!--<div class="top-right am-vertical-align-middle"><i class="am-icon-star-o"></i><span>关注</span>|<span>个人中心</span></div>-->
</div>
<div class="title-box am-vertical-align">
    <div class="am-vertical-align-middle" style="margin-left:20px;"><span>金牌推荐</span></div>
</div>
<div class="am-cf am-g product-box">
    <ul class="am-avg-sm-2 my-shop-product-list">
        <volist name="list" id="vo">
            <li>
                <div class="am-panel am-panel-default">
                    <div class="am-panel-bd product-detail-box">
                        <a href="{:U('Index/detail',array('id'=>$vo['id']))}"> <img class="am-img-responsive" src="{:getImgUrl($vo['img'],120)}" /></a>
                        <div class="product-name-box">
                            <span class="list-product-price-span2"><a href="{:U('Index/detail',array('id'=>$vo['id']))}">【私人定制】{$vo['name']}</a></span>
                        </div>
                        <ol class="am-avg-sm-2 product-list-share">
                            <li style="float:left;"><span class="detail-price">￥{$vo.price}</span></li>
                            <li style="float:right;"><a href="{:U('Index/detail',array('id'=>$vo['id']))}" class="am-btn am-btn-warning am-btn-xs index-addcart-btn am-radius" style="display:block;width:auto;height:auto">立即购买</a></li>
                        </ol>
                    </div>
                </div>
            </li>
        </volist>

    </ul>
</div>
<!--隐藏页面异步加载页数-->
<input id="page" type="hidden" value="1">
<input id="cate_id" type="hidden" value="{$cate_id}">
<script>
    $(function(){

        // dropload
        var dropload = $('.product-box').dropload({
            scrollArea : window,
            domDown : {
                domClass   : 'dropload-down',
                domRefresh : '<div class="dropload-refresh">↑上拉加载更多</div>',
                domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',
                domNoData  : '<div class="dropload-noData"></div>'
            },

            loadDownFn : function(me){
                var page = parseInt($('#page').val())+1;

                var name = "{$name}";
                var ulrstr = '';


                if(name !==''){
                    ulrstr = "&name="+name;
                }

                ulrstrl="page="+page;
                $.ajax({
                    type: 'GET',
                    url: "{:U('Classify/private_query')}",
                    data:ulrstrl+ulrstr,
                    dataType: 'json',
                    success: function(data){
                        console.log('dasdasda');
                        if(data['status']){
                            $('#page').val(page);
                            console.log(data.info.length);
                            var result = '';
                            for(var i = 0; i < data.info.length; i++){

                                result +=  "<li><div class='am-panel am-panel-default'><div class='am-panel-bd product-detail-box'><img class='am-img-responsive' src='__IMG__/activity2.jpg' />"+
                                        "<div><span class='list-product-price-span2'>【特色农产品】"+data.info[i].name+"</span> </div>"+
                                        "<ol class='am-avg-sm-2 product-list-share'> <li ><span class='detail-price' style='float:left;'>￥{$vo.price}</span></li>"+
                                        "<li ><center><a class='am-btn am-btn-warning am-btn-xs index-addcart-btn am-radius' style='display:block;width:auto;height:auto'>立即购买</a></center></li>"+
                                        "</ol></div> </div> </li>";
                            }

                            // 为了测试，延迟1秒加载
                            setTimeout(function(){
                                $('.my-shop-product-list').append(result);
                                // 每次数据加载完，必须重置
                                dropload.resetload();
                            },1000);
                        }else{
                            // 锁定
                            me.lock();
                            // 无数据
                            me.noData();
                        }
                        // 为了测试，延迟1秒加载
                        setTimeout(function(){
                            // 每次数据加载完，必须重置
                            me.resetload();
                        },1500);
                    }, error: function(xhr, type){
                        alert('Ajax error!');
                        // 即使加载出错，也得重置
                        dropload.resetload();
                    }
                });
            }
        });
    });
</script>
</body>
</html>